<template>
  <div class="about">
    <div class="acoutItem" v-for="(item,index) in dataList" :key="index" :style="$store.getters.screenWidth ? 'flex-wrap:wrap': ''">
      <div style="display:flex;align-items:center">
        <i class="el-icon-s-order" style="font-size:40px;color:#ccc;margin-right:5px"></i>
        <div>
          <h4 style="font-size:16px;font-weight:400;text-align:left;">{{item.name}}</h4>
          <div style="color:#76838f;font-size:16px;line-height:1.8">
            <span style="margin-right:8px">{{item.size/1000}}KB</span>
            <span>{{item.createAt.slice(0,10)}}</span>
          </div>
        </div>
      </div>
      <el-link :href="item.path">
        <el-button type="primary" >立即下载</el-button>
      </el-link>
    </div>
  </div>
</template>
<script>
import imageText from "../components/imageText";
import footerPart from "../views/footer";
import { multipartFiler } from "../api/api";
export default {
  data() {
    return {
      activeName: "second",
      dataList: []
    };
  },
  components: {
    imageText,
    footerPart
  },
  created() {
    this.getdata();
  },
  methods: {
    getdata() {
      let that = this;
      multipartFiler({
        pageNo: 0,
        pageSize: 10,
        pageType: "A"
      }).then(res => {
        that.dataList = res.data.data;
      });
    },
    handleClick(tab) {
      console.log(tab.index);
      switch (tab.index) {
        case "0":
          this.$router.push("/About");
          break;
        case "1":
          this.$router.push("/contant");
          break;
        case "2":
          this.$router.push("/Join");
          break;
        case "3":
          this.$router.push("/feedback");
          break;
      }
    }
  }
};
</script>
<style lang="scss" scoped>
::v-deep .el-tabs__active-bar{
  background-color: #fff;
}
.about {
  width: 100%;
  padding: 50px;
  .acoutItem {
    width: 100%;
    padding: 15px;
    border-bottom: 1px solid #e4eaec;
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
}
</style>